<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>后台管理</title>
      <link type="text/css" rel="stylesheet" th:href="@{/layui/css/layui.css}">
    <link th:href="@{/lib/font-awesome/css/font-awesome.css}" rel="stylesheet" />
    <link th:href="@{/lib/bootstraps/css/bootstrap.css}" rel="stylesheet" />
    <link th:href="@{/lib/bootstraps/css/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet" />
    <link th:href="@{/lib/jsTree/css/style.min.css}" rel="stylesheet" />
    <link th:href="@{/lib/jqTreeGrid/css/jquery.treegrid.css}" rel="stylesheet" />
</head>

<body style="padding-top:10px">
    <blockquote class="demoTable layui-elem-quote" style="padding:10px 10px;border:0px">
		<div class="layui-inline">
			<button class="layui-btn layui-btn-sm" onclick="addMenus()">新增目录</button>
		</div>
	</blockquote>
	
	<table id="exampleTable" data-mobile-responsive="true"></table>

    <div class="modal fade" id="addMenus" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog" style="width:40%;;">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                    <h4 class="modal-title" id="myModalLabel">添加菜单</h4>
                </div>
                <form  class="form-horizontal"  action="/permission/add" method="post" id="addMenuForm" onsubmit="return checkForm()" style="margin-top:10px">
                	 <input id="parentid" name="parentid" type="hidden">
                	 <input id="id" name="id" type="hidden">
                     <div class="form-group">
                         <label  class="col-sm-3 control-label">上级目录:</label>
                         <div class="col-sm-8">
                             <input type="text" class="form-control" id="parentName" name="" placeholder="请填写上级目录" value="" readonly="readonly"/>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">上级目录权限代码:</label>
                         <div class="col-sm-8">
                             <input type="text" class="form-control" id="parentCode" name="parentCode" placeholder="请填写上级目录权限代码" value=""/>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">菜单名称:</label>
                         <div class="col-sm-8">
                             <input type="text" class="form-control" id="name" name="name" placeholder="请填写菜单名称" value=""/>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">菜单类型:</label>
                         <div class="col-sm-8">
                             <label class="radio-inline">
						        <input type="radio" name="type" id="type0" value="0" checked> 目录
						    </label>
                             <label class="radio-inline">
						        <input type="radio" name="type" id="type1" value="1" > 菜单
						    </label>
						    <label class="radio-inline">
						        <input type="radio" name="type" id="type2"  value="2"> 按钮
						    </label>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">链接地址:</label>
                         <div class="col-sm-8">
                             <input type="text" class="form-control" id="url" name="url" placeholder="请填写链接地址" value=""/>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">权限代码:</label>
                         <div class="col-sm-8">
                             <input type="text" class="form-control" id="percode" name="percode" placeholder="请填写权限代码" value=""/>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">状态:</label>
                         <div class="col-sm-8">
                             <label class="radio-inline">
						        <input type="radio" name="status" id="status1" value="0" checked> 启用
						    </label>
						    <label class="radio-inline">
						        <input type="radio" name="status" id="status2"  value="2"> 未启用
						    </label>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">排序:</label>
                         <div class="col-sm-8">
                             <input type="text" class="form-control" id="sortstring" name="sort" placeholder="请填写序号" value=""/>
                         </div>
                     </div>
                     <div class="form-group">
                         <label class="col-sm-3 control-label">图标:</label>
                         <div class="col-sm-6" style="width:30%">
                            <input type="text" class="form-control" style="width: auto;" id="icon" name="icon" placeholder="例如:fa fa-bolt" value=""/>
                         </div>
                          <div class="col-sm-2">
                             <button type="button" class="btn btn-info" onclick="selectIcon()" >选择图标</button>
                          </div>
                     </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-default"  data-dismiss="modal">关闭</button>
                        <button  id="tijiao" class="btn btn-primary" type="submit">提交 </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
    <script th:src="@{/layui/layui.js}" type="text/javascript" charset="utf-8"></script>
    <script th:src="@{/js/common.js}" type="text/javascript" charset="utf-8"></script>
    <script th:src="@{/js/jquery-3.2.1.min.js}" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" th:src="@{/lib/bootstraps/js/bootstrap.js}"></script>
    <script type="text/javascript" th:src="@{/lib/bootstraps/js/bootstrap-table/bootstrap-table.min.js}"></script>
    <script type="text/javascript" th:src="@{/lib/bootstraps/js/bootstrap-table/locale/bootstrap-table-zh-CN.min.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jqTreeGrid/js/jquery.treegrid.min.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jqTreeGrid/js/jquery.treegrid.bootstrap3.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jqTreeGrid/js/jquery.treegrid.extension.js}"></script>
    <script type="text/javascript" th:src="@{/lib/jsTree/js/jstree.min.js}"></script>
    <script type="text/javascript" th:src="@{/js/menu/menu.js}"></script>
    <script>
        layui.use(['layer'], function() {
            var layer = layui.layer
        });
      
    </script>
</body>
</html>